<template>
    <div>
        <el-tabs :before-leave="beforeLeave" v-model="activeName" type="card">
            <el-tab-pane label="列表数据" name="DataList">
                <data-list/>
            </el-tab-pane>
            <el-tab-pane label="统计数据" name="DataStatistics">
                <data-statistics :resizeSignal="resizeSignal"/>
            </el-tab-pane>
            <el-tab-pane label="数据分布" name="DataDistribution">
                <data-distribution/>
            </el-tab-pane>
            <el-tab-pane label="数据预测" name="DataForecast">
                <data-forecast/>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
import DataList from "../components/RadiationDataComponents/DataList";
import DataStatistics from "../components/RadiationDataComponents/DataStatistics";
import DataDistribution from "../components/RadiationDataComponents/DataDistribution";
import DataForecast from "../components/RadiationDataComponents/DataForecast";

export default {
    name: "RadiationData",
    data(){
        return{
            activeName: "DataList",
            resizeSignal: false
        }
    },
    methods:{
        beforeLeave(activeName,oldActiveName){
            if(activeName === 'DataStatistics'){
                this.resizeSignal = true
            }else{
                this.resizeSignal = false
            }
        }
    },
    components:{
        DataList,
        DataStatistics,
        DataDistribution,
        DataForecast
    }
}
</script>

<style scoped>
::v-deep .el-tabs__item.is-active {
    background-color: #f7f7f7;
    font-weight: bold;
}
</style>